<template>
<div class="app-container">
  {{test}}
  <mt-header fixed title="黑马程序员"></mt-header>
  <nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item mui-active" href="#tabbar">
				<span class="mui-icon mui-icon-home"></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-chat">
				<span class="mui-icon mui-icon-email"><span class="mui-badge">9</span></span>
				<span class="mui-tab-label">消息</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-contact">
				<span class="mui-icon mui-icon-contact"></span>
				<span class="mui-tab-label">通讯录</span>
			</a>
			<a class="mui-tab-item" href="#tabbar-with-map">
				<span class="mui-icon mui-icon-gear"></span>
				<span class="mui-tab-label">设置</span>
			</a>
		</nav>
</div>
</template>

<script>
export default {
  name: 'app',
  data () {
    return {
     test:"test"
    }
  }
}
</script>

<style lang="scss" scoped>
body{
    margin: 0;
}
 .app-container {  
     padding-top: 40px;  
 }   
</style>

